<script setup lang="ts">
import './node-style.scss'
import {inject, ref} from "vue";
import {Node} from "@antv/x6";
import {WebDiskEsApi, WebDiskEsVO} from "@/api/ai/webdiskes";
import {OutputNode} from "@/views/ai/agent/x6/node/types";

const formData = reactive<any>({
  esId:undefined,
  indexName:undefined,
})
const esDbs=ref<WebDiskEsVO[]>([])
const init = async () => {
  esDbs.value = await WebDiskEsApi.getWebDiskEsList();
}
const id=ref<string>()
const getNode=inject<()=>Node>('getNode')
if(getNode){
  const node=getNode()
  id.value=node.id
}
onBeforeMount(()=>{
  if(getNode){
    const node=getNode()
    const d=node.getData()
    if (d){
      Object.assign(formData,d)
    }else {
      node.setData(formData)
    }
  }
})
onMounted(() => {
  init()
})
watch(formData,()=>{
  if(getNode){
    const node=getNode()
    node.setData(formData,{deep:true,overwrite:true})
  }
},{deep:true,immediate:false})
</script>

<template>
  <div class="node">
    <div class="node-title line5">
      <div class="flow-dot" magnet="true" :class="'flow-exec'" x-type="input-exec" :x-id="'input-exec_'+id"></div>
      <div>从ES查询</div>
      <div class="flow-dot flow-right flow-exec" magnet="true" x-type="output-exec" :x-id="'output-exec_'+id"></div>
    </div>
    <div class="line5">
      <div class="flow-dot flow-object" magnet="true" x-type="input-json" :x-id="'input-json_'+id"></div>
      <div>查询条件</div>
    </div>
    <div class="line5">
      <div class="flow-right">文档集合</div>
      <div class="flow-dot flow-array-document" magnet="true" x-type="output-array-document" :x-id="'output-array-document_'+id" x-key="document"></div>
    </div>
    <el-form :model="formData" label-position="top">
      <el-form-item label="数据库" prop="esId">
        <el-select v-model="formData.esId">
          <el-option v-for="es in esDbs" :key="es.id" :label="es.name" :value="es.id"/>
        </el-select>
      </el-form-item>
      <el-form-item label="索引" prop="indexName">
        <el-input v-model="formData.indexName"/>
      </el-form-item>
    </el-form>
  </div>
</template>

<style scoped lang="scss">

</style>
